<template>
  <!-- header -->
  <header id="header">
    <div class="wrap">
      <div class="main">
        <h1 id="mobile">UCTOO</h1>
        <!-- navigation -->
        <ul id="navigation">
          <li><a href="/"
               class="anchor">首页<span class="border"></span></a></li>
          <li><a href="https://gitee.com/uctoo"
               class="anchor"
               target="_blank">开源项目<span class="border"></span></a></li>
          <li><a href="https://www.kancloud.cn/doc_uctoo/manual"
               class="anchor"
               target="_blank">文档<span class="border"></span></a></li>
          <li class="center"><a id="logo"
               href="/">
              <h1>UCToo</h1><span class="label rotate"></span>
            </a></li> <!-- logo -->
          <li><a href="/index/user/index"
               class="anchor">会员中心<span class="border"></span></a></li>
          <li><a href="/admin/index/login"
               class="anchor">管理中心<span class="border"></span></a></li>
        </ul>
        <!-- mobile navigation -->
        <div id="nav-mobile"></div>
      </div>
    </div>
    <div class="after"></div>
  </header>
</template>

<script lang="ts">
import { reactive, toRefs, defineComponent } from "vue";
export default defineComponent({
  name: "i-header",
  setup() {
    const data = reactive({});
    return {
      ...toRefs(data),
    };
  },
});
</script>

<style lang="scss" scoped>
</style>
